<template>
    <div>
        <el-container>
            <el-header style="text-align: left;border-bottom: 2px solid #ec771b">
                <p  style="margin-right: 15px">充值记录</p>
            </el-header>
            <el-main>
                <el-table
                        :data="tableData"
                        stripe
                        style="width: 100%">
                    <el-table-column
                            prop="date"
                            label="充值时间"
                            width="180">
                    </el-table-column>
                    <el-table-column
                            prop="money"
                            label="充值金额"
                            width="180">
                    </el-table-column>
                    <el-table-column
                            prop="way"
                            label="充值方式">
                    </el-table-column>
                    <el-table-column
                            prop="result"
                            label="充值结果">
                    </el-table-column>
                </el-table>
            </el-main>
        </el-container>
        <el-pagination
                background
                layout="prev, pager, next"
                :total="1000">
        </el-pagination>
    </div>
</template>

<script>
    export default {
        name: '',
        components: {},
        props: {},
        data() {
            return {
                tableData: [
                    {
                    date: '2016-05-02',
                    money: '100',
                    way: '微信',
                    result: '成功'
                    },
                    {
                        date: '2016-05-02',
                        money: '100',
                        way: '微信',
                        result: '成功'
                    },
                ]
            }
        },
        computed: {},
        watch: {},
        methods: {

        },
        created() {

        },
        mounted() {
        },
    }

</script>

<style scoped>
    .el-header {
        padding: 0px;
    }
    element.style {
        height: 35px;
        text-align: left;
        border-bottom: 2px solid rgb(236, 119, 27);
    }
    .el-header p{
        font-size: 18px;
        color: #ec771b;

    }
    .el-header a:hover{
        color: #ec771b;
    }
    div > ul > li {
        display: inline-block;
        margin: 25px;
        font-size: 15px;
    }
    div > ul > li > a {
        display: block;
        width: 100px;
        height: 70px;
        background-color: #f0f0f0;
    }
    div > ul > li > a:active{
        border: 1px solid #ec771b;
    }

</style>

